JS 2015 (ES6)

Web Development - জাভাস্ক্রিপ্ট (JavaScript) জাভাস্ক্রিপ্ট আপডেট ভার্সন (JS Update Version) |
319
319

ECMAScript 2015 (ES6) হলো জাভাস্ক্রিপ্টের একটি গুরুত্বপূর্ণ আপডেট যা ২০১৫ সালে প্রকাশিত হয়। ES6 পূর্ববর্তী সংস্করণগুলোর উপর ভিত্তি করে তৈরি এবং এতে জাভাস্ক্রিপ্টের ক্ষমতাকে উল্লেখযোগ্যভাবে বৃদ্ধি করে বিভিন্ন নতুন বৈশিষ্ট্য এবং ফিচার যোগ করা হয়েছে। এই আপডেটে ভাষার সিনট্যাক্স উন্নত করা হয়েছে, যা কোড লেখাকে সহজ, পরিষ্কার এবং আরও কার্যকর করে তোলে।


ES6 এর প্রধান বৈশিষ্ট্যসমূহ

let এবং const

let এবং const কিওয়ার্ডগুলো ES6 এ পরিচিতি পেয়েছে, যা ভেরিয়েবল ডিক্লেয়ার করার জন্য ব্যবহৃত হয়। এগুলো var এর তুলনায় ব্লক-স্কোপড (block-scoped) এবং পূর্বাভাসযোগ্য (predictable) আচরণ প্রদান করে।

let name = "Alice";
const age = 25;

name = "Bob";    // সম্ভব
age = 30;        // TypeError: Assignment to constant variable.

অ্যারো ফাংশন (Arrow Functions)

অ্যারো ফাংশন ES6 এ একটি সংক্ষিপ্ত এবং কার্যকরী ফাংশন ডেফিনিশন পদ্ধতি। এটি this কিওয়ার্ডের আচরণ পরিবর্তন করে, যা বিশেষভাবে কনটেক্সট (context) ম্যানেজমেন্টে সহায়ক।

const greet = (name) => `Hello, ${name}!`;

console.log(greet("Alice"));  // আউটপুট: Hello, Alice!

ক্লাস (Classes)

ক্লাস জাভাস্ক্রিপ্টে অবজেক্ট-অরিয়েন্টেড প্রোগ্রামিং (OOP) ধারণাকে সহজতর করে। এটি প্রোটোটাইপ-ভিত্তিক জাভাস্ক্রিপ্টকে ক্লাস-ভিত্তিক শৈলীতে রূপান্তর করে।

class Person {
    constructor(name, age) {
        this.name = name;
        this.age = age;
    }

    greet() {
        console.log(`Hello, my name is ${this.name} and I am ${this.age} years old.`);
    }
}

const person1 = new Person("Alice", 25);
person1.greet();  // আউটপুট: Hello, my name is Alice and I am 25 years old.

টেমপ্লেট লিটারেল (Template Literals)

টেমপ্লেট লিটারেল স্ট্রিং ইন্টারপোলেশন সহজ করে, যা স্ট্রিংয়ের মধ্যে ভেরিয়েবল বা এক্সপ্রেশন এম্বেড করার সুযোগ দেয়।

const name = "Alice";
const age = 25;
const message = `Hello, my name is ${name} and I am ${age} years old.`;

console.log(message);  // আউটপুট: Hello, my name is Alice and I am 25 years old.

ডেস্ট্রাকচারিং অ্যাসাইনমেন্ট (Destructuring Assignment)

ডেস্ট্রাকচারিং এর মাধ্যমে অ্যারে এবং অবজেক্ট থেকে ভেরিয়েবল সহজে এক্সট্রাক্ট করা যায়।

অ্যারে ডেস্ট্রাকচারিং:

const numbers = [1, 2, 3];
const [a, b, c] = numbers;

console.log(a, b, c);  // আউটপুট: 1 2 3

অবজেক্ট ডেস্ট্রাকচারিং:

const person = { name: "Alice", age: 25 };
const { name, age } = person;

console.log(name, age);  // আউটপুট: Alice 25

ডিফল্ট প্যারামিটারস (Default Parameters)

ডিফল্ট প্যারামিটারস ফাংশনের প্যারামিটারগুলোর জন্য পূর্বনির্ধারিত মান নির্ধারণ করতে ব্যবহৃত হয়।

function greet(name = "Guest") {
    console.log(`Hello, ${name}!`);
}

greet();           // আউটপুট: Hello, Guest!
greet("Alice");    // আউটপুট: Hello, Alice!

রেস্ট এবং স্প্রেড অপারেটর (Rest and Spread Operators)

রেস্ট অপারেটর ফাংশনে অজানা সংখ্যক আর্গুমেন্ট গ্রহণ করতে ব্যবহৃত হয়, আর স্প্রেড অপারেটর একটি অ্যারে বা অবজেক্টকে পৃথক উপাদানে ভাঙতে ব্যবহৃত হয়।

রেস্ট অপারেটর:

function sum(...numbers) {
    return numbers.reduce((acc, num) => acc + num, 0);
}

console.log(sum(1, 2, 3, 4));  // আউটপুট: 10

স্প্রেড অপারেটর:

const arr1 = [1, 2, 3];
const arr2 = [...arr1, 4, 5];

console.log(arr2);  // আউটপুট: [1, 2, 3, 4, 5]

মডিউল (Modules)

মডিউল কোডকে আলাদা ফাইল এবং ইউনিটে বিভক্ত করার সুবিধা দেয়, যা কোডের পুনরায় ব্যবহারযোগ্যতা এবং রক্ষণাবেক্ষণ সহজ করে।

এক্সপোর্ট:

// math.js
export const add = (a, b) => a + b;
export const subtract = (a, b) => a - b;

ইনপোর্ট:

// main.js
import { add, subtract } from './math.js';

console.log(add(5, 3));        // আউটপুট: 8
console.log(subtract(5, 3));   // আউটপুট: 2

প্রমিস (Promises)

প্রমিস অ্যাসিঙ্ক্রোনাস অপারেশন পরিচালনা করতে ব্যবহৃত হয়, যা কলব্যাক ফাংশনের জটিলতা কমায়।

const fetchData = () => {
    return new Promise((resolve, reject) => {
        setTimeout(() => {
            resolve("Data fetched successfully!");
        }, 2000);
    });
};

fetchData()
    .then(data => console.log(data))      // আউটপুট: Data fetched successfully!
    .catch(error => console.error(error));

ইটারেটর এবং জেনারেটর (Iterators and Generators)

ইটারেটর এবং জেনারেটর ES6 এ জাভাস্ক্রিপ্টের কনট্রোল ফ্লো এবং লুপিং পদ্ধতিগুলো উন্নত করে।

জেনারেটর ফাংশন:

function* generator() {
    yield 1;
    yield 2;
    yield 3;
}

const gen = generator();

console.log(gen.next().value);  // আউটপুট: 1
console.log(gen.next().value);  // আউটপুট: 2
console.log(gen.next().value);  // আউটপুট: 3

এনহান্সড অবজেক্ট লিটারেলস (Enhanced Object Literals)

ES6 এ অবজেক্ট লিটারেলসকে আরও কার্যকরী এবং সংক্ষিপ্ত করা হয়েছে।

const name = "Alice";
const age = 25;

// আগের পদ্ধতি:
const person1 = {
    name: name,
    age: age,
    greet: function() {
        console.log(`Hello, my name is ${this.name}`);
    }
};

// ES6 পদ্ধতি:
const person2 = {
    name,
    age,
    greet() {
        console.log(`Hello, my name is ${this.name}`);
    }
};

person2.greet();  // আউটপুট: Hello, my name is Alice

সিম্বলস (Symbols)

সিম্বলস হল ইউনিক এবং ইমিউটেবল ভ্যালু, যা অবজেক্ট প্রপার্টির কিওয়ার্ড হিসেবে ব্যবহার করা হয়।

const sym1 = Symbol('description');
const sym2 = Symbol('description');

console.log(sym1 === sym2);  // আউটপুট: false

const obj = {
    [sym1]: 'value1',
    [sym2]: 'value2'
};

console.log(obj[sym1]);  // আউটপুট: value1
console.log(obj[sym2]);  // আউটপুট: value2

সেট এবং ম্যাপ (Sets and Maps)

সেট এবং ম্যাপ হল নতুন ডেটা স্ট্রাকচার যা ইউনিক ভ্যালু এবং কী-ভ্যালু পেয়ার স্টোর করতে ব্যবহৃত হয়।

সেট:

const mySet = new Set([1, 2, 3, 2]);
console.log(mySet);  // আউটপুট: Set {1, 2, 3}

ম্যাপ:

const myMap = new Map();
myMap.set('a', 1);
myMap.set('b', 2);
console.log(myMap);  // আউটপুট: Map {'a' => 1, 'b' => 2}

বাইনারি এবং অক্টাল লিটারেলস (Binary and Octal Literals)

ES6 এ বাইনারি (0b) এবং অক্টাল (0o) লিটারেলস সমর্থন করা হয়েছে, যা সংখ্যাগুলোকে বাইনারি এবং অক্টাল ফর্মেটে নির্ধারণ করতে ব্যবহৃত হয়।

const binary = 0b1010;  // 10
const octal = 0o12;     // 10

console.log(binary);  // আউটপুট: 10
console.log(octal);   // আউটপুট: 10


ES6 এর অন্যান্য গুরুত্বপূর্ণ বৈশিষ্ট্য

Array.prototype.find() এবং Array.prototype.findIndex()

find() মেথডটি অ্যারের প্রথম উপাদান খুঁজে বের করে যা নির্দিষ্ট শর্ত পূরণ করে। findIndex() একইভাবে কাজ করে, তবে এটি উপাদানের সূচক রিটার্ন করে।

const numbers = [1, 2, 3, 4, 5];

const found = numbers.find(num => num > 3);
console.log(found);  // আউটপুট: 4

const index = numbers.findIndex(num => num > 3);
console.log(index);  // আউটপুট: 3

String.prototype.startsWith() এবং String.prototype.endsWith()

startsWith() এবং endsWith() মেথডগুলো স্ট্রিংয়ের শুরু এবং শেষ পরীক্ষা করতে ব্যবহৃত হয়।

const str = "Hello, World!";

console.log(str.startsWith("Hello"));  // আউটপুট: true
console.log(str.endsWith("World!"));   // আউটপুট: true

String.prototype.repeat()

repeat() মেথডটি একটি স্ট্রিংকে নির্দিষ্ট সংখ্যক বার রিপিট করে।

const str = "Hello! ";
console.log(str.repeat(3));  // আউটপুট: Hello! Hello! Hello! 

Object.assign()

Object.assign() মেথডটি একাধিক অবজেক্ট থেকে প্রপার্টি একত্রিত করে একটি নতুন অবজেক্ট তৈরি করে।

const obj1 = { a: 1 };
const obj2 = { b: 2 };
const obj3 = Object.assign({}, obj1, obj2);

console.log(obj3);  // আউটপুট: { a: 1, b: 2 }

Promise.finally()

Promise.finally() মেথডটি প্রতিশ্রুতির শেষে কিছু কোড চালানোর জন্য ব্যবহৃত হয়, যা সফল বা ব্যর্থ হওয়ার পরেই এক্সিকিউট হয়।

fetchData()
    .then(data => console.log(data))
    .catch(error => console.error(error))
    .finally(() => console.log('Operation completed.'));

ES6 এর সুবিধাসমূহ

  • কোডের সংক্ষিপ্ততা: ES6 এর নতুন সিনট্যাক্স যেমন অ্যারো ফাংশন এবং টেমপ্লেট লিটারেল কোডকে আরও সংক্ষিপ্ত এবং পাঠযোগ্য করে তোলে।
  • ব্লক-স্কোপড ভেরিয়েবল: let এবং const ব্যবহার করে ব্লক-স্কোপড ভেরিয়েবল ডিক্লেয়ার করা যায়, যা ভেরিয়েবল হোইস্টিং এবং স্কোপ সম্পর্কিত সমস্যা কমায়।
  • অবজেক্ট-অরিয়েন্টেড প্রোগ্রামিং: ক্লাসের মাধ্যমে OOP ধারণাকে সহজতর করে, যা কোডের সংগঠন এবং রক্ষণাবেক্ষণ সহজ করে।
  • আ্যাসিঙ্ক্রোনাস প্রোগ্রামিং: প্রমিস এবং অ্যাসিঙ্ক/অ্যাওয়েট মেথড ব্যবহার করে অ্যাসিঙ্ক্রোনাস কোড লেখা সহজ এবং পরিষ্কার হয়।
  • মডিউল সিস্টেম: মডিউল ব্যবহারে কোডকে আলাদা ফাইল এবং ইউনিটে বিভক্ত করা যায়, যা পুনরায় ব্যবহারযোগ্যতা এবং রক্ষণাবেক্ষণ সহজ করে।
  • নতুন ডেটা স্ট্রাকচার: সেট এবং ম্যাপের মাধ্যমে ডেটা ম্যানিপুলেশন আরও কার্যকরী হয়।

সারাংশ

ECMAScript 2015 (ES6) জাভাস্ক্রিপ্টের একটি মাইলস্টোন যা ভাষার ক্ষমতাকে ব্যাপকভাবে বৃদ্ধি করে এবং ডেভেলপারদের জন্য নতুন সরঞ্জাম ও বৈশিষ্ট্য প্রদান করে। let এবং const, অ্যারো ফাংশন, ক্লাস, টেমপ্লেট লিটারেল, ডেস্ট্রাকচারিং অ্যাসাইনমেন্ট, রেস্ট ও স্প্রেড অপারেটর, মডিউল, প্রমিস, এবং আরও অনেক বৈশিষ্ট্য কোড লেখাকে আরও সহজ, সংক্ষিপ্ত এবং কার্যকর করে তোলে। এই আপডেটের মাধ্যমে জাভাস্ক্রিপ্ট এখন আরও শক্তিশালী, সংগঠিত এবং রক্ষণাবেক্ষণযোগ্য ভাষা হিসেবে প্রতিষ্ঠিত হয়েছে, যা বড় এবং জটিল প্রজেক্টগুলির ক্ষেত্রে বিশেষভাবে উপকারী।

ES6 এর এই নতুন বৈশিষ্ট্যগুলো শিখে এবং ব্যবহার করে আপনি আপনার জাভাস্ক্রিপ্ট কোডকে আরও উন্নত এবং নির্ভরযোগ্য করতে পারবেন, যা আপনার প্রোগ্রামিং দক্ষতাকে নতুন উচ্চতায় পৌঁছে দেবে।


অতিরিক্ত টিপস

  • ES6 বৈশিষ্ট্যগুলো অনুশীলন করুন: নতুন সিনট্যাক্স এবং মেথডগুলোকে ব্যবহার করে কোড লিখার মাধ্যমে তাদের কার্যকারিতা বুঝুন।
  • মডিউল সিস্টেম ব্যবহার করুন: কোডকে আলাদা ফাইল এবং মডিউলে বিভক্ত করে তার পুনরায় ব্যবহারযোগ্যতা এবং রক্ষণাবেক্ষণ সহজ করুন।
  • প্রমিস এবং অ্যাসিঙ্ক/অ্যাওয়েট মেথড শিখুন: অ্যাসিঙ্ক্রোনাস অপারেশনগুলি পরিচালনা করতে প্রমিস এবং অ্যাসিঙ্ক/অ্যাওয়েট এর ব্যবহার শিখুন।
  • ক্লাস ও অবজেক্ট-অরিয়েন্টেড প্রোগ্রামিং অনুশীলন করুন: ক্লাস এবং ইনহেরিটেন্স ব্যবহার করে জটিল কোড কাঠামো তৈরি করার অনুশীলন করুন।
  • রেগুলার এক্সপ্রেশন (RegEx) ব্যবহার করুন: স্ট্রিং সার্চ এবং ম্যানিপুলেশনে রেগুলার এক্সপ্রেশন ব্যবহার শিখুন, যা স্ট্রিং ম্যানিপুলেশনকে আরও শক্তিশালী করে তোলে।

ES6 এর নতুন বৈশিষ্ট্যগুলোকে ভালোভাবে বুঝে এবং প্রয়োগ করে আপনি আপনার জাভাস্ক্রিপ্ট প্রোগ্রামিং দক্ষতাকে আরও উন্নত এবং কার্যকরী করতে পারবেন।

Content added By
টপ রেটেড অ্যাপ

স্যাট অ্যাকাডেমী অ্যাপ

আমাদের অল-ইন-ওয়ান মোবাইল অ্যাপের মাধ্যমে সীমাহীন শেখার সুযোগ উপভোগ করুন।

ভিডিও
লাইভ ক্লাস
এক্সাম
ডাউনলোড করুন
Promotion